<template>
    <div class="addsilt">
        <van-nav-bar
            left-text="新增收货地址"
            right-text="```"
            left-arrow
            @click-left="$router.go(-1)"
            @click-right="$router.push('/addsite')"
        />
        <!-- 收货地址表单 -->
        <div class="site" >
           联系人 <input type="text" placeholder="性名" v-model="siteText.name" ><br>
           电&nbsp;&nbsp;&nbsp;话 <input type="text" placeholder="手机号码" v-model="siteText.phone"><span>+通讯录</span><br>
           地&nbsp;&nbsp;&nbsp;址 <input type="text" placeholder="选择收货地址" ><br>
           门牌号 <input type="text" placeholder="例：5号楼203室" v-model="siteText.address"><br>
           <input type="button" value="保存并使用" class="btn" @click="request_address(siteText)">

        </div>
    </div>
</template>

<script>
// 映射vuex里的方法
import { mapActions, MapperForAction } from 'vuex';
export default {
    data(){
        return{
           siteText:{
                userid:JSON.parse(localStorage.getItem('userinfo')).id,
                address:'',
                phone:'',
                name:''
           }
        }
    },
    methods:{
        ...mapActions(['request_address'])
    },
}
</script>

<style lang="scss" scoped>
    .addsilt{
        width: 100%;
        padding: 10px 16px 0;
        
        input{
            width: 60%;
            margin:10px ;
            border: none;
            outline: none;
            font-size: 14px;
        }
        span{
            font-size: 14px;
            color:rgb(83, 168, 242) ;
        }
        .btn{
            width: 85%;
            height: 40px;
            background: rgb(83, 168, 242);
            color: white;
            border-radius: 5px;
        }
        
    }
</style>